/* ...existing code... */

/* 隐藏模板变量的修饰符 */
.template-var-delimiter-start.hidden,
.template-var-delimiter-end.hidden {
  display: none;
}

.template-var-content {
  background-color: rgba(255, 230, 180, 0.5);
  border-radius: 3px;
  padding: 2px 0;
}

/* 处理模板变量的样式 */
.template-variable-hidden {
  opacity: 0;
  position: absolute;
  pointer-events: none;
}

.template-variable-widget {
  background-color: rgba(255, 230, 180, 0.5);
  border-radius: 3px;
  padding: 2px 4px;
  position: relative;
  white-space: nowrap;
  color: #333;
}

.template-variable {
  background-color: rgba(255, 230, 180, 0.5);
  border-radius: 3px;
  position: relative;
}

.template-variable::before {
  content: attr(data-variable-content);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.template-variable > * {
  opacity: 0;
}

.template-variable-original-hidden {
  color: transparent;
  caret-color: black; /* 确保光标仍然可见 */
  position: relative;
  z-index: 1;
}

/* 模板变量节点样式 */
[data-template-variable] {
  background-color: rgba(255, 223, 186, 0.5);
  border-radius: 3px;
  padding: 1px 4px;
  font-weight: bold;
  color: #c25100;
  cursor: pointer;
  display: inline-block;
}

[data-template-variable]:hover {
  background-color: rgba(255, 223, 186, 0.8);
}

/* 选中状态的模板变量节点 */
.ProseMirror-selectednode[data-template-variable] {
  outline: 2px solid #68CEF8;
  background-color: rgba(255, 223, 186, 0.8);
}

/* ...existing code... */
